﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Usuario.aspx.cs" MasterPageFile="MasterPage.Master" Inherits="Web.Pages._Usuario" %>

<asp:Content ID="mainContent" ContentPlaceHolderID="MainContent" runat="Server" >

    <!-- Estilos -->
    <style type="text/css" >
        #tblUsuario_DatosSistema input,
        #tblUsuario_DatosPersonales input
        {
            width: 99%;
        }
        .imgUsuario_Foto
        {
            border: 1px solid #a6c9e2;
            margin-bottom: 5px;
        }
    </style>
    <!-- Fin de [Estilos] -->

    <!--$(document).ready-->  
    <script type="text/javascript" >

        var _usuarioInfo = null;
        var _params = null;

        var controles = { General: {}, Usuario: {} };
        /* General */
        controles.General.btnGuardar    = "btnGuardar";
        controles.General.btnEliminar   = "btnEliminar";
        controles.General.btnFoto       = "btnUsuario_Foto";
        /* Usuario */
        controles.Usuario.Nombre        = "<%= txtUsuario_Nombre.ClientID %>";
        controles.Usuario.Apellido      = "<%= txtUsuario_Apellido.ClientID %>";
        controles.Usuario.Telefono      = "<%= txtUsuario_Telefono.ClientID %>";
        controles.Usuario.Celular       = "<%= txtUsuario_Celular.ClientID %>";
        controles.Usuario.Email         = "<%= txtUsuario_Email.ClientID %>";
        controles.Usuario.Banco         = "<%= txtUsuario_Banco.ClientID %>";
        controles.Usuario.TipoDocumento = "<%= selUsuario_TipoDocumento.ClientID %>";
        controles.Usuario.NroDocumento  = "<%= txtUsuario_NroDocumento.ClientID %>";
        controles.Usuario.Cuit          = "<%= txtUsuario_CUIT.ClientID %>";
        controles.Usuario.Tipo          = "<%= selUsuario_Tipo.ClientID %>";
        controles.Usuario.Categoria     = "<%= selUsuario_Categoria.ClientID %>";
        controles.Usuario.NombreUsuario = "<%= txtUsuario_NombreUsuario.ClientID %>";
        controles.Usuario.Password      = "<%= txtUsuario_Password.ClientID %>";
        controles.Usuario.Foto          = "<%= imgUsuario_Foto.ClientID %>";
        controles.Usuario.NroMatricula  = "<%= txtUsuario_NroMatricula.ClientID %>";
        controles.Usuario.Activo        = "<%= hdnUsuario_Activo.ClientID %>";

        $(document).ready(function()
        {
            procesarParametros();
            cargarPagina_Usuario();
        });
        function procesarParametros()
        {
            Framework.Page.Parameters.parseQueryString();
        }
        function cargarPagina_Usuario()
        {
            Site.Messages.showLoadingMessage();

            Site.Page.setTitle(isEmpty(Framework.Page.Parameters.idUsuario) ? "Alta de nuevo Usuario" : "Edición de Usuario");

            crearPlaceHolders();

            $("#{0}".format(controles.General.btnGuardar)).click(function () { guardarDatos(); });
            $("#{0}".format(controles.General.btnEliminar)).click(function () { eliminarDatos(); });

            Helpers.MultiSelectHelper.configure("#{0}, #{1}, #{2}".format(controles.Usuario.TipoDocumento, controles.Usuario.Tipo, controles.Usuario.Categoria), false);
            Helpers.MultiSelectHelper.bindOnChange("#{0}".format(controles.Usuario.Tipo), onChange_TipoUsuario);

            deshabilitarControles();            

            if ( validarPermisosAdmin(_CurrentUser.Tipo) )
            {
                deshabilitarControles(true);
                habilitarControl(controles.General.btnEliminar, true);
                activarControlFileUpload();
            }

            if ( isEmpty(Framework.Page.Parameters.idUsuario))
            {
                $("#" + controles.General.btnEliminar).hide();
            }

            if ( !isEmpty(Framework.Page.Parameters.idUsuario) )
            {
                //var txtNombreUsuario = $("#{0}".format(controles.Usuario.NombreUsuario));
                //var txtPassword = $("#{0}".format(controles.Usuario.Password));
                //var txtNroDocumento = $("#{0}".format(controles.Usuario.NroDocumento));
                //    txtNroDocumento.change
                //    (
                //        function()
                //        {
                //            txtNombreUsuario.val($(this).val());
                //            txtPassword.val($(this).val());
                //        }
                //    );
                //    txtNroDocumento.keyup
                //    (
                //        function(event)
                //        {
                //            txtNombreUsuario.val($(this).val());
                //            txtPassword.val($(this).val());
                //        }
                //    );
            }

            if (Framework.Page.Parameters.idUsuario == _CurrentUser.Id)
            {
                var habilitar = true;
                habilitarControl("#{0}".format(controles.Usuario.Password), habilitar);
                habilitarControl("#{0}".format(controles.Usuario.Email), habilitar);
                habilitarControl("#{0}".format(controles.Usuario.Telefono), habilitar);
                habilitarControl("#{0}".format(controles.Usuario.Celular), habilitar);
                $("#{0}".format(controles.General.btnFoto)).next().attr("disabled", !habilitar);
                activarControlFileUpload();
                habilitarControl("#{0}".format(controles.General.btnGuardar), habilitar);
            }

            allowOnlyNumbers( $("#{0}".format(controles.Usuario.NroDocumento)) );

            //if (!isEmpty(usuarioInfo.Foto))
            //    $("#imgUsuario_Foto").attr("src", "data:image/png;base64," + usuarioInfo.Foto);
            //else
            //    $("#imgUsuario_Foto").addClass("grisado");

            Site.Messages.hideLoadingMessage();

            if ( $("#{0}".format(controles.Usuario.Activo)).val() == "0" )
                mostrarMensajeContenidoBloqueado(habilitarUsuario);
        }
        function crearPlaceHolders()
        {
            addPlaceHolder(controles.Usuario.Nombre, "<< NOMBRE >>");
            addPlaceHolder(controles.Usuario.Apellido, "<< APELLIDO >>");
            addPlaceHolder(controles.Usuario.Telefono, "<< TELÉFONO >>");
            addPlaceHolder(controles.Usuario.Celular, "<< CELULAR >>");
            addPlaceHolder(controles.Usuario.Email, "<< E-MAIL >>");
            addPlaceHolder(controles.Usuario.Banco, "<< BANCO >>");
            //addPlaceHolder(controles.Usuario.TipoDocumento, "<< NOMBRE >>");
            addPlaceHolder(controles.Usuario.NroDocumento, "<< NRO. DOCUMENTO >>");
            addPlaceHolder(controles.Usuario.Cuit, "<< NRO. CUIT >>");
            addPlaceHolder(controles.Usuario.NroMatricula, "<< NRO. MATRÍCULA >>");
            //addPlaceHolder(controles.Usuario.Tipo, "<< NOMBRE >>");
            //addPlaceHolder(controles.Usuario.Categoria, "<< NOMBRE >>");
            addPlaceHolder(controles.Usuario.NombreUsuario, "<< NOMBRE DE USUARIO >>");
            addPlaceHolder(controles.Usuario.Password, "<< PASSWORD >>");
        }
        function habilitarUsuario() {
            activarEntidad("Usuario", Framework.Page.Parameters.idUsuario, reloadPage);
        }
        function deshabilitarControles(habilitar)
        {
            var _habilitar = false;
            if ( !isEmpty(habilitar) )
                _habilitar = habilitar;

            habilitarControl("#{0}".format(controles.General.btnGuardar), _habilitar);
            habilitarControl("#{0}".format(controles.General.btnEliminar), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.NombreUsuario), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Password), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Nombre), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Apellido), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Telefono), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Celular), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Email), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.TipoDocumento), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.NroDocumento), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.NroMatricula), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Cuit), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Banco), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Tipo), _habilitar);
            habilitarControl("#{0}".format(controles.Usuario.Categoria), _habilitar);
            $("#{0}".format(controles.General.btnFoto)).next().attr("disabled", !_habilitar);
        }
        function activarControlFileUpload()
        {
            Helpers.FileUploadHelper.configurar(_ImageHandler, controles.General.btnFoto, Site.Messages.showLoadingMessage, Site.Messages.hideLoadingMessage, onUploadPictureResponse);
            $("#{0}".format(controles.General.btnFoto)).parent().removeAttr("overflow");
        }
        function onUploadPictureResponse(response)
        {
            response = jQuery.parseJSON(response);
            $("#" + controles.Usuario.Foto).attr('src', 'data:image/png;base64,' + response.Valor);
        }
        function onChange_TipoUsuario(seleccionado, valor, texto)
        {
            var categorias = [];
            texto = texto.toUpperCase();
            if ( texto == _TiposUsuario.Adaptador || texto == _TiposUsuario.Mezclador || texto == _TiposUsuario.Traductor )
                categorias[0] = 2; //_CategoriasUsuario.Freelance;
            else
                categorias[0] = 1; //_CategoriasUsuario.Contratado;
            Helpers.MultiSelectHelper.setSelected(controles.Usuario.Categoria, categorias, true);
        }        
    </script>
    
    <!-- CRUD -->
    <script type="text/javascript" >
        function guardarUsuario()
        {
            var imgData = null;
            var imgSrc = $("#{0}".format(controles.Usuario.Foto)).attr("src");
            if ( imgSrc != null && imgSrc != undefined )
                imgData = imgSrc.trim().replace("data:image/png;base64,", "");

            var usuarioInfo =
                {
                    Id              : !isEmpty(Framework.Page.Parameters.idUsuario) ? Framework.Page.Parameters.idUsuario : Constants.Entities.DefaultId,
                    Foto            : imgData,
                    IdTipo          : Helpers.MultiSelectHelper.getFirstSelectedValue(controles.Usuario.Tipo),
                    IdCategoria     : Helpers.MultiSelectHelper.getFirstSelectedValue(controles.Usuario.Categoria),
                    NombreUsuario   : $("#{0}".format(controles.Usuario.NombreUsuario)).val(),
                    Password        : $("#{0}".format(controles.Usuario.Password)).val(),
                    Nombre          : $("#{0}".format(controles.Usuario.Nombre)).val(),
                    Apellido        : $("#{0}".format(controles.Usuario.Apellido)).val(),
                    Telefono        : $("#{0}".format(controles.Usuario.Telefono)).val(),
                    Celular         : $("#{0}".format(controles.Usuario.Celular)).val(),
                    Email           : $("#{0}".format(controles.Usuario.Email)).val(),
                    NroDocumento    : $("#{0}".format(controles.Usuario.NroDocumento)).val(),
                    IdTipoDocumento : Helpers.MultiSelectHelper.getFirstSelectedValue(controles.Usuario.TipoDocumento),
                    NroMatricula    : $("#{0}".format(controles.Usuario.NroMatricula)).val(),
                    CUIT            : $("#{0}".format(controles.Usuario.Cuit)).val(),
                    Banco           : $("#{0}".format(controles.Usuario.Banco)).val(),
                };
            return usuarioInfo;
        }
        function guardarDatos()
        {
            var usuarioInfo = guardarUsuario();

            if ( !validarGuardarDatos(usuarioInfo) )
                return;

            Helpers.AJAXHelper.invoke("guardarUsuario", "{'infoUsuario':'" + JSON.stringify(usuarioInfo).replace(/'/g, "\\'") + "'}", guardarDatos_Respuesta, null, null );
        }
        function guardarDatos_Respuesta(datos)
        {
            var tipoNotificacion = null;
            var forzarCierre = false;
            var fnReturn = null;

            var respuesta = jQuery.parseJSON(datos.d);
            if ( respuesta.Resultado )
            {
                tipoNotificacion = _notifications.success;
                forzarCierre = true;
                //fnReturn = goBack;
                fnReturn = verListadoUsuarios;
                /*
                var usuarioInfo = respuesta.Valor;
                cargarUsuario(usuarioInfo);
                */
            }
            else
            {
                tipoNotificacion = _notifications.error;
                forzarCierre = true;
            }

            mostrarNotificacion(tipoNotificacion, respuesta.Mensaje, forzarCierre, fnReturn);
        }
        function verListadoUsuarios()
        {
            verUsuarios();
        }
        function eliminarDatos()
        {
            eliminarUsuario(Framework.Page.Parameters.idUsuario, mostrarMensajeContenidoBloqueado);
        }
        function validarGuardarDatos(usuarioInfo)
        {
            var errores = [];
            
            validarDatosUsuario(usuarioInfo, errores);

            if ( errores.length > 0 )
                return false;
            else
                return true;
        }
        function validarDatosUsuario(usuarioInfo, errores)
        {
            if ( usuarioInfo.IdTipo == Constants.Entities.DefaultId )
                registrarError( $("#{0}".format(controles.Usuario.Tipo)).next(), errores );
            if ( usuarioInfo.IdTipoDocumento == Constants.Entities.DefaultId )
                registrarError( $("#{0}".format(controles.Usuario.TipoDocumento)).next(), errores );
            if ( usuarioInfo.IdCategoria == Constants.Entities.DefaultId )
                registrarError( $("#{0}".format(controles.Usuario.Categoria)).next(), errores );
            if ( isEmpty(usuarioInfo.Email) )
                registrarError( $("#{0}".format(controles.Usuario.Email)), errores );
            if ( isEmpty(usuarioInfo.NroDocumento) )
                registrarError( $("#{0}".format(controles.Usuario.NroDocumento)), errores );
            if ( isEmpty(usuarioInfo.NroMatricula) )
                registrarError( $("#{0}".format(controles.Usuario.NroMatricula)), errores );
            if ( isEmpty(usuarioInfo.NombreUsuario) )
                registrarError( $("#{0}".format(controles.Usuario.NombreUsuario)), errores );
            if ( isEmpty(usuarioInfo.Password) )
                registrarError( $("#{0}".format(controles.Usuario.Password)), errores );
            if ( isEmpty(usuarioInfo.Nombre) )
                registrarError( $("#{0}".format(controles.Usuario.Nombre)), errores );
            if ( isEmpty(usuarioInfo.Apellido) )
                registrarError( $("#{0}".format(controles.Usuario.Apellido)), errores );
        }
    </script>

    <!--HTML-->
    <div id="content" style="margin:0 auto; width:90%;" >

        <!-- BOTONERA -->
        <div style="margin-top:20px; margin-bottom:20px;" >
            <table width="100%" border="0" cellpadding="0" cellspacing="0" >
                <colgroup>
                    <col width="80%" />
                    <col width="20%" />
                </colgroup>
                <tr>
                    <td>
                        <!--
                        <label>Estado actual: </label>
                        <select id="selUsuario_Estado" multiple="multiple" ></select>
                        -->
                    </td>
                    <td align="right" >
                        <div id="btnGuardar" class="boton" >
                            <img src="Images/16x16/guardar.png" alt="Guardar" />&nbsp;Guardar
                        </div>
                        <div id="btnEliminar" class="boton" >
                            <img src="Images/16x16/eliminar.png" alt="Guardar" />&nbsp;Eliminar
                        </div>
                    </td>
                </tr>
            </table>
        </div>
        <!-- Fin de [BOTONERA] -->
        
        <input id="hdnUsuario_Activo" type="hidden" runat="server" />

        <div style="margin-bottom:20px;" >
            <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                <colgroup>
                    <col width="15%" />
                    <col width="85%" />
                </colgroup>
                <tr>
                    <td rowspan="2" >
                        <div style="padding-bottom:5px;" >
                            <fieldset class="ui-widget ui-widget-content ui-corner-all" >
                                <legend class="ui-widget-header" >Foto de perfil</legend>
                                <img id="imgUsuario_Foto" class="imgUsuario_foto" src="" width="150" height="162" alt="Foto del Usuario" runat="server" />
                                <div id="btnUsuario_Foto" class="botonAccion" style="width:100px" >
                                    <img src="Images/16x16/foto.png" alt="Cambia foto" />
                                    <label>Cambiar foto</label>
                                </div>
                            </fieldset>
                        </div>
                    </td>
                    <td>
                        <div>
                            <fieldset class="ui-widget ui-widget-content ui-corner-all" >
                                <legend class="ui-widget-header" >Datos personales</legend>
                                <table id="tblUsuario_DatosPersonales" border="0" cellpadding="0" cellspacing="0" width="100%" >
                                    <colgroup>
                                        <col width="20%" />
                                        <col width="25%" />
                                        <col width="10%" />
                                        <col width="20%" />
                                        <col width="25%" />
                                    </colgroup>
                                    <tr>
                                        <td>
                                            <label>Nombre:</label>                        
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_Nombre" class="txtValor" runat="server" />
                                        </td>
                                        <td>
                                            &nbsp;
                                        </td>
                                        <td>
                                            <label>Apellido:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_Apellido" class="txtValor" runat="server" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <label>Teléfono:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_Telefono" class="txtValor" runat="server" />
                                        </td>
                                        <td>
                                            &nbsp;
                                        </td>
                                        <td>
                                            <label>Celular:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_Celular" class="txtValor" runat="server" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <label>Email:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_Email" class="txtValor" runat="server" />
                                        </td>
                                        <td>
                                            &nbsp;
                                        </td>
                                        <td>
                                            <label>Banco:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_Banco" class="txtValor" runat="server" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <label>Tipo Documento:</label>
                                        </td>
                                        <td>
                                            <select id="selUsuario_TipoDocumento" multiple="true" runat="server" ></select>
                                        </td>
                                        <td>
                                            &nbsp;
                                        </td>
                                        <td>
                                            <label>Nro. Documento:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_NroDocumento" class="txtValor" runat="server" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <label>CUIT:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_CUIT" class="txtValor" runat="server" />
                                        </td>
                                        <td>
                                            &nbsp;
                                        </td>
                                        <td>
                                            <label>Nro. Matrícula</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_NroMatricula" class="txtValor" runat="server" />
                                        </td>
                                    </tr>
                                </table>
                            </fieldset>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <div style="margin-top: 5px;" >
                            <fieldset class="ui-widget ui-widget-content ui-corner-all" >
                                <legend class="ui-widget-header" >Datos Sistema</legend>
                                <table id="tblUsuario_DatosSistema" border="0" cellpadding="0" cellspacing="0" width="100%" >
                                    <colgroup>
                                        <col width="20%" />
                                        <col width="25%" />
                                        <col width="10%" />
                                        <col width="20%" />
                                        <col width="25%" />
                                    </colgroup>
                                    <tr>
                                        <td>
                                            <label>Tipo:</label>
                                        </td>
                                        <td>
                                            <span>
                                                <select id="selUsuario_Tipo" multiple="true" runat="server" ></select>
                                            </span>
                                        </td>
                                        <td>
                                            &nbsp;
                                        </td>
                                        <td>
                                            <label>Categoría:</label>
                                        </td>
                                        <td>
                                            <select id="selUsuario_Categoria" multiple="true" runat="server" ></select>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <label>Nombre de Usuario:</label>
                                        </td>
                                        <td>
                                            <input type="text" id="txtUsuario_NombreUsuario" class="txtValor" runat="server" />
                                        </td>
                                        <td>
                                            &nbsp;
                                        </td>
                                        <td>
                                            <label>Password:</label>
                                        </td>
                                        <td>
                                            <input id="txtUsuario_Password" class="txtValor" runat="server" />
                                        </td>
                                    </tr>
                                </table>
                            </fieldset>                    
                        </div>
                    </td>
                </tr>
            </table>
        </div>         

    </div>

</asp:Content>